<script setup>
    import {ref,onMounted} from 'vue'
    import http from '@/utils/http.js'

    const params={
        key:"540eade30635f61ce97d546f359f2d65",
        city:"金华",
    }

    const weatherData=ref(null)
    const getWeather=async()=>{
        const response=await http.get('/simpleWeather/query',{params:params})
        weatherData.value=response.result.realtime;
    }

    //在 组件挂载完成后执行 getWeather() 函数
    onMounted(()=>{
        getWeather();
    });

</script>

<template>
    <div>
        <h3>金华天气</h3>
        <div v-if="weatherData">
            <span>温度：{{ weatherData.temperature }}</span><br>
            <span>湿度：{{ weatherData.humidity }}</span><br>
            <span>空气质量：{{ weatherData.aqi }}</span><br>
        </div>
    </div>
</template>